<template>
	<view class="cu-dialog">
		<view class="cu-bar bg-white justify-end solid-bottom">
			<view class="content">添加成员</view>
			<view class="action" @tap="hideModal">
				<text class="cuIcon-close text-red"></text>
			</view>
		</view>
		<view class="cu-form-group solid-bottom">
			<view class="title">成员类型:</view>
			<picker @change="PickerChange"  :range="memberType">
				<view class="picker">
					{{memberType[index]}}
				</view>
			</picker>
		</view>
		<view class="cu-bar search bg-white solid-bottom">
			<view class="search-form ">
				<text class="cuIcon-search"></text>
				<!-- <input @focus="InputFocus" @blur="InputBlur" :adjust-position="false" type="text" placeholder="手机号/身份证号" submite-type="search"></input> -->
				<input v-model.trim="search" :adjust-position="false" type="text" :placeholder="placeholder[index]" submite-type="search"></input>
				<text class="input-clear cuIcon-close" v-if="search" @click="search=''"></text>
			</view>
			<view class="action" @click="handleSearch(index, search)">
				<button class="cu-btn bg-blue shadow-blur">
					<text>搜索</text>
				</button>
			</view>
		</view>
		
		<view class="cu-form-group solid-bottom">
			<text class="title">查询结果：</text>
		</view>
		<view class="search-list">
		<!-- 	<checkbox-group @change="checkboxChange">			
				<view class="solid-bottom" v-for="(item,index) in searchList" :key="index" >
					<label class="cu-form-group" style="justify-content: flex-start;">
						<view class="title">
							  <checkbox class="round blue" :value="item.userid"  />								
						</view>
						<view>{{item.name }}</view>		
					</label>
				</view>			
			</checkbox-group> -->
			<!-- 当选 -->
			<radio-group @change="radioChange" class="block">			
				<view class="solid-bottom" v-for="(item,index) in searchList" :key="index" >
					<label class="cu-form-group" style="justify-content: flex-start;">
						<view class="title">
							  <radio class="round blue" :value="item.userid" :disabled="item.disabled" />								
						</view>
						<view>{{item.name }}</view>		
					</label>
				</view>			
			</radio-group>
		</view>
		
		
		<view class="cu-bar bg-white solid-top">
			<view class="action margin-0 flex-sub  solid-left" @tap="hideModal">取消</view>
			<view class="action margin-0 flex-sub  text-blue solid-left " @tap="submite(index, addMemberUserId)">确定</view>
		</view>
	</view>
	
</template>

<!-- 邀请、 添加成员 -->

<script>

	import { searchPerson } from '@/common/api/common.js'
	import { searchEnterprise, addSignRoomPeople } from '@/common/api/zft.js'
	export default {
		props:['roomId', 'room'],
		data() {
			return {
				signRoomName: '签约室',
				modalName: null,
				index: 0,
				// 查找到的成员列表
				searchList: [],
				placeholder: ['请输入身份证', '社会统一信用代码/名称'],
				memberType: ['自然人','企业'],
				// 模态框中输入的值
				search: '',
				addMemberUserId:'',
				loading: false
			}
		},
		methods: {
			RegionChange(e) {
				this.region = e.detail.value
			},
			adContract() {
				uni.navigateTo({
					url: '/pages/contract-edit/contract-edit',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			checkboxChange(e) {
				console.log('eeeeeeeee', e)
				this.addMemberUserId = e.detail.value[0] || e.detail.value
			
			},
			radioChange(e) {
				this.addMemberUserId = e.detail.value
			},
			PickerChange(e) {
				this.index = e.detail.value
			},
			hideModal(e) {
				this.search = ''
				this.searchList = []
				this.addMemberUserId = ''
				this.$emit('hideModal')
			},
			handleSearch(index, val) {	
				this.searchList = []
				if (val !== '' && index == 0) {
					console.log('---------------------------------------')
					searchPerson({ str_value: val }).then(({data}) => {
						console.log('----- 查找数据 自然人-----', data)
						if (data && data.msgcode == 1000) {		
							if (data.data.length >= 0) {
								this.searchList = data.data
								this.searchList = this.disabledResult(this.searchList)
							} else {
								this.showToast('没有查询到信息')
							}
							
						} else {
							this.showToast(data.msg)
						}
						
					})
				} else if (val !== '' && index == 1) {
					searchEnterprise({ values: val}).then(({data}) => {
						console.log('----- 查找数据 企业 -----', data)
						if (data && data.msgcode == 1000) {
							data.data.map(item => {
								item.name = item.Name
								item.userid = item.Userid
								this.searchList.push(item)
							})
							this.searchList = this.disabledResult(this.searchList)							
						} else {
							this.showToast(data.msg)
						}
						
					})
				}
			},
			
			// 查看是否有禁用
			disabledResult(arr) {
				let roomMember = this.room.CS_RoomMember
				let res = []
				arr.map(s => {
					roomMember.map(m => {
						if (m.MemberUserid === s.userid) {
							s.disabled = true;
						}
					})	
					res.push(s)
				})				
				return res;
			},
			submite(index, id) {
				console.log('index', index);
				if (this.loading) return
				if (!this.roomId) {
					this.showToast('当前页面存在错误，请关闭当前页面重试')
					return
				}
				if (id) {
					this.loading = true
					// 自然人 1 	企业 2 
					let params = {
						roomId: this.roomId,
						userId: id,
						IdentityType: parseInt(index) + 1, // 人员类型
					}
					console.log('---------保存的数据---------', params)
					addSignRoomPeople(params).then(({data}) => {
						console.log('----保存返回数据------------', data)
						if (data.msgcode == 1000) {
							// this.showToast('添加成功')
							this.$emit('changeRoom', data.data)
						} else {
							this.showToast(data.msg)
						}
						this.hideModal()
					}).then(() => {
						this.loading = false
					})
					
				} else {
					this.hideModal()
				}
			}
		}
	}
</script>

<style>
	.search-list {
		max-height: 50vh;
		overflow: auto;
	}
</style>
